/**
 * ChatMessages - 消息列表组件
 * 负责渲染所有聊天消息
 */
import React from 'react';
import { motion } from "motion/react";
import MessageItem from './MessageItem';
import { type ChatMessage } from '../model/Message';

interface ChatMessagesProps {
  messages: ChatMessage[];
}

const ChatMessages: React.FC<ChatMessagesProps> = ({ messages }) => {
  return (
    <div className="space-y-6">
      {messages.map((message, index) => (
        <motion.div
          key={message.id}
          initial={{ opacity: 0, y: 20 }}
          animate={{ opacity: 1, y: 0 }}
          transition={{ duration: 0.3, delay: index === messages.length - 1 ? 0.1 : 0 }}
        >
          <MessageItem message={message} />
        </motion.div>
      ))}
    </div>
  );
};

export default ChatMessages;
